<script  setup>
import { useRouter, useRoute } from 'vue-router'

const router = useRouter();
const handleSelect = (index) => {
  // router.replace(`${index}/${ii++}`);
  router.push(index);
}

const route = useRoute()
//这里的route.fullPath并不是当前路由地址,而是'/',这里路由还没有被修改成与当前页面路径一致
//const default_show_route=route.fullPath;

const items = [{
  title: "welcome", path: '/front'
}
  , { title: "文件上传", path: '/about' },
{ title: "文件列表", path: '/tabs' },
{ title: "商品", path: '/product' },
{ title: "cart", path: '/cart' },
{ title: "订单", path: '/order' },
];
//{ path: '/users/eduardo' }


</script>
<template>
  <div class="common-layout">
    <el-container>
      <el-header>
        <el-row class="row-bg" justify="center">
          <el-menu :default-active="$route.fullPath" class="el-menu-demo" mode="horizontal" @select="handleSelect"
            :router="true" :ellipsis="false">
            <el-menu-item v-for="({ title, path }, mid) in items" :key="mid" :index="path" :router="path">{{ title
            }}</el-menu-item>
          </el-menu>
        </el-row>
      </el-header>
      <el-main><router-view></router-view></el-main>
    </el-container>
  </div>
</template>
